<template>
  <div class="hero-website-startup">
    <div class="header-type-1">
      <div class="header-type-12">
        <div class="pateern">
          <div class="mask">
            <div class="mask2"></div>
            <div class="mask2"></div>
            <div class="mask3"></div>
          </div>
        </div>
        <div class="header">
          <div class="rectangle"></div>
          <div class="wiredunk">FILMACTION</div>
          <div class="button-let-talk">
            <div class="rectangle2"></div>
            <div class="services">Search</div>
          </div>
          <svg
            class="menu"
            width="40"
            height="40"
            viewBox="0 0 40 40"
            fill="none"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              fill-rule="evenodd"
              clip-rule="evenodd"
              d="M8 11H32V13H8V11ZM8 27H32V29H8V27ZM32 19H8V21H32V19Z"
              fill="white"
            />
          </svg>

          <svg
            class="vector"
            width="18"
            height="16"
            viewBox="0 0 18 16"
            fill="none"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M4 0V16M14 0V16M0 4H4M9 8L18 4M0 8H18M0 12H4M14 12H18M1 16H17C17.2652 16 17.5196 15.8946 17.7071 15.7071C17.8946 15.5196 18 15.2652 18 15V1C18 0.734784 17.8946 0.48043 17.7071 0.292893C17.5196 0.105357 17.2652 0 17 0H1C0.734784 0 0.48043 0.105357 0.292893 0.292893C0.105357 0.48043 0 0.734784 0 1V15C0 15.2652 0.105357 15.5196 0.292893 15.7071C0.48043 15.8946 0.734784 16 1 16Z"
              stroke="white"
              stroke-width="1.5"
              stroke-linecap="round"
              stroke-linejoin="round"
            />
          </svg>
        </div>
      </div>
    </div>
    <svg
      class="ic-search"
      width="114"
      height="24"
      viewBox="0 0 114 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        fill-rule="evenodd"
        clip-rule="evenodd"
        d="M108.5 13H107.71L107.43 12.73C108.41 11.59 109 10.11 109 8.5C109 4.91 106.09 2 102.5 2C98.91 2 96 4.91 96 8.5C96 12.09 98.91 15 102.5 15C104.11 15 105.59 14.41 106.73 13.43L107 13.71V14.5L112 19.49L113.49 18L108.5 13ZM102.5 13C100.01 13 98 10.99 98 8.5C98 6.01 100.01 4 102.5 4C104.99 4 107 6.01 107 8.5C107 10.99 104.99 13 102.5 13Z"
        fill="white"
      />
    </svg>

    <div class="_2019-mahameru">© 2023. Filmaction</div>
    <div>
      <div class="mobile-dumber">
        <div class="mobile-dumber2">
          <div class="cm">分镜头脚本</div>
          <div class="storyboard">Storyboard</div>
        </div>
      </div>
    </div>
    <div class="select-employee">
      <div class="rectangle-1738"></div>
      <div class="mobile-dumber3"></div>
    </div>
    <div class="select-employee">
      <div class="rectangle-17382"></div>
      <div class="mobile-dumber4">
        <div class="_4">镜号4</div>
      </div>
    </div>
    <div class="select-employee">
      <div class="rectangle-17383"></div>
      <div class="mobile-dumber5"></div>
    </div>
    <div class="select-employee">
      <div class="rectangle-17384"></div>
      <div class="mobile-dumber6"></div>
    </div>
    <div class="select-employee">
      <div class="rectangle-17385"></div>
      <div class="mobile-dumber7"></div>
    </div>
    <div class="select-employee">
      <div class="rectangle-17386"></div>
      <div class="mobile-dumber8"></div>
    </div>
    <div class="_1">镜号1</div>
    <div class="_2">镜号2</div>
    <div class="_22">镜号2</div>
    <div class="_3">镜号3</div>
    <div class="_32">镜号3</div>
    <div class="block">
      <div class="image">
        <svg
          class="icon-variants"
          width="96"
          height="96"
          viewBox="0 0 96 96"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M42.3638 14.0625C42.3638 17.7921 40.8822 21.369 38.2449 24.0062C35.6077 26.6434 32.0309 28.125 28.3013 28.125C24.5716 28.125 20.9948 26.6434 18.3576 24.0062C15.7203 21.369 14.2388 17.7921 14.2388 14.0625C14.2388 10.3329 15.7203 6.75604 18.3576 4.11881C20.9948 1.48158 24.5716 0 28.3013 0C32.0309 0 35.6077 1.48158 38.2449 4.11881C40.8822 6.75604 42.3638 10.3329 42.3638 14.0625ZM66.1294 36.8606C65.6019 36.5964 65.0046 36.5047 64.4222 36.5986C63.8397 36.6925 63.3015 36.9672 62.8838 37.3838L42.015 63.8775L27.0525 48.285C26.5123 47.9253 25.8643 47.7636 25.2184 47.8271C24.5725 47.8907 23.9685 48.1757 23.5087 48.6338L3 73.125V84.375C3 85.8668 3.59263 87.2976 4.64752 88.3525C5.70242 89.4074 7.13316 90 8.625 90H87.375C88.1137 90 88.8451 89.8545 89.5276 89.5718C90.2101 89.2891 90.8301 88.8748 91.3525 88.3525C91.8748 87.8301 92.2891 87.2101 92.5718 86.5276C92.8545 85.8451 93 85.1137 93 84.375V59.0625L66.1294 36.8606Z"
            fill="white"
          />
        </svg>
      </div>
    </div>
    <div class="block2">
      <div class="image">
        <svg
          class="icon-variants2"
          width="96"
          height="96"
          viewBox="0 0 96 96"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M42.3638 14.0625C42.3638 17.7921 40.8822 21.369 38.2449 24.0062C35.6077 26.6434 32.0309 28.125 28.3013 28.125C24.5716 28.125 20.9948 26.6434 18.3576 24.0062C15.7203 21.369 14.2388 17.7921 14.2388 14.0625C14.2388 10.3329 15.7203 6.75604 18.3576 4.11881C20.9948 1.48158 24.5716 0 28.3013 0C32.0309 0 35.6077 1.48158 38.2449 4.11881C40.8822 6.75604 42.3638 10.3329 42.3638 14.0625ZM66.1294 36.8606C65.6019 36.5964 65.0046 36.5047 64.4222 36.5986C63.8397 36.6925 63.3015 36.9672 62.8838 37.3838L42.015 63.8775L27.0525 48.285C26.5123 47.9253 25.8643 47.7636 25.2184 47.8271C24.5725 47.8907 23.9685 48.1757 23.5087 48.6338L3 73.125V84.375C3 85.8668 3.59263 87.2976 4.64752 88.3525C5.70242 89.4074 7.13316 90 8.625 90H87.375C88.1137 90 88.8451 89.8545 89.5276 89.5718C90.2101 89.2891 90.8301 88.8748 91.3525 88.3525C91.8748 87.8301 92.2891 87.2101 92.5718 86.5276C92.8545 85.8451 93 85.1137 93 84.375V59.0625L66.1294 36.8606Z"
            fill="white"
          />
        </svg>
      </div>
    </div>
    <div class="block3">
      <div class="image">
        <svg
          class="icon-variants3"
          width="96"
          height="96"
          viewBox="0 0 96 96"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M42.3638 14.0625C42.3638 17.7921 40.8822 21.369 38.2449 24.0062C35.6077 26.6434 32.0309 28.125 28.3013 28.125C24.5716 28.125 20.9948 26.6434 18.3576 24.0062C15.7203 21.369 14.2388 17.7921 14.2388 14.0625C14.2388 10.3329 15.7203 6.75604 18.3576 4.11881C20.9948 1.48158 24.5716 0 28.3013 0C32.0309 0 35.6077 1.48158 38.2449 4.11881C40.8822 6.75604 42.3638 10.3329 42.3638 14.0625ZM66.1294 36.8606C65.6019 36.5964 65.0046 36.5047 64.4222 36.5986C63.8397 36.6925 63.3015 36.9672 62.8838 37.3838L42.015 63.8775L27.0525 48.285C26.5123 47.9253 25.8643 47.7636 25.2184 47.8271C24.5725 47.8907 23.9685 48.1757 23.5087 48.6338L3 73.125V84.375C3 85.8668 3.59263 87.2976 4.64752 88.3525C5.70242 89.4074 7.13316 90 8.625 90H87.375C88.1137 90 88.8451 89.8545 89.5276 89.5718C90.2101 89.2891 90.8301 88.8748 91.3525 88.3525C91.8748 87.8301 92.2891 87.2101 92.5718 86.5276C92.8545 85.8451 93 85.1137 93 84.375V59.0625L66.1294 36.8606Z"
            fill="white"
          />
        </svg>
      </div>
    </div>
    <div class="block4">
      <div class="image">
        <svg
          class="icon-variants4"
          width="96"
          height="96"
          viewBox="0 0 96 96"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M42.3638 14.0625C42.3638 17.7921 40.8822 21.369 38.2449 24.0062C35.6077 26.6434 32.0309 28.125 28.3013 28.125C24.5716 28.125 20.9948 26.6434 18.3576 24.0062C15.7203 21.369 14.2388 17.7921 14.2388 14.0625C14.2388 10.3329 15.7203 6.75604 18.3576 4.11881C20.9948 1.48158 24.5716 0 28.3013 0C32.0309 0 35.6077 1.48158 38.2449 4.11881C40.8822 6.75604 42.3638 10.3329 42.3638 14.0625ZM66.1294 36.8606C65.6019 36.5964 65.0046 36.5047 64.4222 36.5986C63.8397 36.6925 63.3015 36.9672 62.8838 37.3838L42.015 63.8775L27.0525 48.285C26.5123 47.9253 25.8643 47.7636 25.2184 47.8271C24.5725 47.8907 23.9685 48.1757 23.5087 48.6338L3 73.125V84.375C3 85.8668 3.59263 87.2976 4.64752 88.3525C5.70242 89.4074 7.13316 90 8.625 90H87.375C88.1137 90 88.8451 89.8545 89.5276 89.5718C90.2101 89.2891 90.8301 88.8748 91.3525 88.3525C91.8748 87.8301 92.2891 87.2101 92.5718 86.5276C92.8545 85.8451 93 85.1137 93 84.375V59.0625L66.1294 36.8606Z"
            fill="white"
          />
        </svg>
      </div>
    </div>
    <div class="block5">
      <div class="image">
        <svg
          class="icon-variants5"
          width="96"
          height="96"
          viewBox="0 0 96 96"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M42.3638 14.0625C42.3638 17.7921 40.8822 21.369 38.2449 24.0062C35.6077 26.6434 32.0309 28.125 28.3013 28.125C24.5716 28.125 20.9948 26.6434 18.3576 24.0062C15.7203 21.369 14.2388 17.7921 14.2388 14.0625C14.2388 10.3329 15.7203 6.75604 18.3576 4.11881C20.9948 1.48158 24.5716 0 28.3013 0C32.0309 0 35.6077 1.48158 38.2449 4.11881C40.8822 6.75604 42.3638 10.3329 42.3638 14.0625ZM66.1294 36.8606C65.6019 36.5964 65.0046 36.5047 64.4222 36.5986C63.8397 36.6925 63.3015 36.9672 62.8838 37.3838L42.015 63.8775L27.0525 48.285C26.5123 47.9253 25.8643 47.7636 25.2184 47.8271C24.5725 47.8907 23.9685 48.1757 23.5087 48.6338L3 73.125V84.375C3 85.8668 3.59263 87.2976 4.64752 88.3525C5.70242 89.4074 7.13316 90 8.625 90H87.375C88.1137 90 88.8451 89.8545 89.5276 89.5718C90.2101 89.2891 90.8301 88.8748 91.3525 88.3525C91.8748 87.8301 92.2891 87.2101 92.5718 86.5276C92.8545 85.8451 93 85.1137 93 84.375V59.0625L66.1294 36.8606Z"
            fill="white"
          />
        </svg>
      </div>
    </div>
    <div class="block6">
      <div class="image">
        <svg
          class="icon-variants6"
          width="96"
          height="96"
          viewBox="0 0 96 96"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M42.3638 14.0625C42.3638 17.7921 40.8822 21.369 38.2449 24.0062C35.6077 26.6434 32.0309 28.125 28.3013 28.125C24.5716 28.125 20.9948 26.6434 18.3576 24.0062C15.7203 21.369 14.2388 17.7921 14.2388 14.0625C14.2388 10.3329 15.7203 6.75604 18.3576 4.11881C20.9948 1.48158 24.5716 0 28.3013 0C32.0309 0 35.6077 1.48158 38.2449 4.11881C40.8822 6.75604 42.3638 10.3329 42.3638 14.0625ZM66.1294 36.8606C65.6019 36.5964 65.0046 36.5047 64.4222 36.5986C63.8397 36.6925 63.3015 36.9672 62.8838 37.3838L42.015 63.8775L27.0525 48.285C26.5123 47.9253 25.8643 47.7636 25.2184 47.8271C24.5725 47.8907 23.9685 48.1757 23.5087 48.6338L3 73.125V84.375C3 85.8668 3.59263 87.2976 4.64752 88.3525C5.70242 89.4074 7.13316 90 8.625 90H87.375C88.1137 90 88.8451 89.8545 89.5276 89.5718C90.2101 89.2891 90.8301 88.8748 91.3525 88.3525C91.8748 87.8301 92.2891 87.2101 92.5718 86.5276C92.8545 85.8451 93 85.1137 93 84.375V59.0625L66.1294 36.8606Z"
            fill="white"
          />
        </svg>
      </div>
    </div>
    <div class="button-square-2-big-1-primary">
      <div class="group-12">
        <div class="button"></div>
        <div class="button-text"></div>
      </div>
    </div>
    <div class="button-square-2-big-1-primary2">
      <div class="group-12">
        <div class="button"></div>
        <div class="button-text"></div>
      </div>
    </div>
    <div class="button-text2">音 乐</div>
    <div class="button-text3">剪 辑</div>
  </div>
</template>
<script>
/* Code generated with AutoHTML Plugin for Figma */

export default {
  name: "HeroWebsiteStartup",
  components: {},
  props: {},
  data() {
    // quickfix to have components available to pass as props
    return {};
  },
};
</script>
<style scoped>
.hero-website-startup,
.hero-website-startup * {
  box-sizing: border-box;
}
.hero-website-startup {
  background: #ffffff;
  width: 1440px;
  height: 800px;
  position: relative;
  overflow: hidden;
}
.header-type-1 {
  position: absolute;
  inset: 0;
}
.header-type-12 {
  width: 1440px;
  height: 95px;
  position: static;
}
.pateern {
  width: 1440px;
  height: 83px;
  position: static;
}
.mask {
  width: 1440px;
  height: 83px;
  position: static;
}
.mask2 {
  background: #3056d3;
  width: 1440px;
  height: 83px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.mask3 {
  background: #000000;
  border-radius: 130px;
  opacity: 0.10000000149011612;
  width: 1793.68px;
  height: 1184.35px;
  position: absolute;
  left: -1435.28px;
  top: 70.79px;
  transform-origin: 0 0;
  transform: rotate(-45deg) scale(1.413, 0.051);
}
.header {
  width: 1440px;
  height: 80px;
  position: absolute;
  left: 0px;
  top: 15px;
  overflow: hidden;
}
.rectangle {
  width: 1440px;
  height: 80px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.wiredunk {
  color: #ffffff;
  text-align: left;
  font: 700 24px "Montserrat", sans-serif;
  position: absolute;
  left: 131px;
  top: calc(50% - 26px);
}
.button-let-talk {
  width: 142px;
  height: 38px;
  position: absolute;
  left: 1131px;
  top: 11px;
  overflow: hidden;
}
.rectangle2 {
  background: #ffffff;
  border-radius: 30px;
  opacity: 0.10000000149011612;
  width: 142px;
  height: 38px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.services {
  color: #ffffff;
  text-align: left;
  font: 400 16px "Lato", sans-serif;
  position: absolute;
  left: 44px;
  top: 9px;
}
.menu {
  position: absolute;
  left: 1353px;
  top: 9px;
  overflow: visible;
}
.vector {
  position: absolute;
  left: 101px;
  top: 21px;
  overflow: visible;
}
.ic-search {
  position: absolute;
  left: 1216px;
  top: 34px;
  overflow: visible;
}
._2019-mahameru {
  color: #a78585;
  text-align: left;
  font: 400 10px/24px "Open Sans", sans-serif;
  position: absolute;
  left: 675px;
  top: calc(50% - -350px);
}
.not-data {
  position: absolute;
  inset: 0;
}
.mobile-dumber {
  width: 188.02px;
  height: 19px;
  position: static;
}
.mobile-dumber2 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 188.02px;
  position: absolute;
  left: 211px;
  top: 191px;
}
.cm {
  color: var(--_03, #22215b);
  text-align: center;
  font: 700 14px "Manrope", sans-serif;
  position: relative;
}
.storyboard {
  color: var(--_04, #9090ad);
  text-align: center;
  font: 500 14px "Manrope", sans-serif;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.select-employee {
  position: absolute;
  inset: 0;
}
.rectangle-1738 {
  background: #ffffff;
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(34, 33, 91, 0.16);
  border-width: 1px;
  width: 306px;
  height: 96.81px;
  position: absolute;
  left: 222px;
  top: 246px;
}
.mobile-dumber3 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 27.18px;
  height: 34.06px;
  position: absolute;
  left: 220px;
  top: 229px;
}
.rectangle-17382 {
  background: #ffffff;
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(34, 33, 91, 0.16);
  border-width: 1px;
  width: 306px;
  height: 96.81px;
  position: absolute;
  left: 783px;
  top: 246px;
}
.mobile-dumber4 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 27.18px;
  height: 34.06px;
  position: absolute;
  left: 781px;
  top: 229px;
}
._4 {
  color: var(--_03, #22215b);
  text-align: center;
  font: 400 14px "Manrope", sans-serif;
  position: relative;
}
.rectangle-17383 {
  background: #ffffff;
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(34, 33, 91, 0.16);
  border-width: 1px;
  width: 306px;
  height: 96.81px;
  position: absolute;
  left: 222px;
  top: 374px;
}
.mobile-dumber5 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 27.18px;
  height: 34.06px;
  position: absolute;
  left: 220px;
  top: 357px;
}
.rectangle-17384 {
  background: #ffffff;
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(34, 33, 91, 0.16);
  border-width: 1px;
  width: 306px;
  height: 96.81px;
  position: absolute;
  left: 783px;
  top: 374px;
}
.mobile-dumber6 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 27.18px;
  height: 34.06px;
  position: absolute;
  left: 781px;
  top: 357px;
}
.rectangle-17385 {
  background: #ffffff;
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(34, 33, 91, 0.16);
  border-width: 1px;
  width: 306px;
  height: 96.81px;
  position: absolute;
  left: 224px;
  top: 510px;
}
.mobile-dumber7 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 27.18px;
  height: 34.06px;
  position: absolute;
  left: 222px;
  top: 493px;
}
.rectangle-17386 {
  background: #ffffff;
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(34, 33, 91, 0.16);
  border-width: 1px;
  width: 306px;
  height: 96.81px;
  position: absolute;
  left: 785px;
  top: 510px;
}
.mobile-dumber8 {
  background: #ffffff;
  padding: 0px 10px 0px 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 27.18px;
  height: 34.06px;
  position: absolute;
  left: 783px;
  top: 493px;
}
._1 {
  color: var(--_03, #22215b);
  text-align: center;
  font: 400 14px "Manrope", sans-serif;
  position: absolute;
  left: 222px;
  top: 232px;
}
._2 {
  color: var(--_03, #22215b);
  text-align: center;
  font: 400 14px "Manrope", sans-serif;
  position: absolute;
  left: 221px;
  top: 360px;
}
._22 {
  color: var(--_03, #22215b);
  text-align: center;
  font: 400 14px "Manrope", sans-serif;
  position: absolute;
  left: 782px;
  top: 360px;
}
._3 {
  color: var(--_03, #22215b);
  text-align: center;
  font: 400 14px "Manrope", sans-serif;
  position: absolute;
  left: 223px;
  top: 496px;
}
._32 {
  color: var(--_03, #22215b);
  text-align: center;
  font: 400 14px "Manrope", sans-serif;
  position: absolute;
  left: 784px;
  top: 496px;
}
.block {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 122px;
  height: 103px;
  position: absolute;
  left: 556px;
  top: 240px;
}
.image {
  background: #e8ecf3;
  border-radius: 16px;
  flex-shrink: 0;
  width: 122px;
  height: 103px;
  position: relative;
}
.icon-variants {
  position: absolute;
  left: calc(50% - 48px);
  top: calc(50% - 47.5px);
  overflow: visible;
}
.block2 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 122px;
  height: 103px;
  position: absolute;
  left: 1117px;
  top: 240px;
}
.icon-variants2 {
  position: absolute;
  left: calc(50% - 48px);
  top: calc(50% - 47.5px);
  overflow: visible;
}
.block3 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 122px;
  height: 103px;
  position: absolute;
  left: 556px;
  top: 368px;
}
.icon-variants3 {
  position: absolute;
  left: calc(50% - 48px);
  top: calc(50% - 47.5px);
  overflow: visible;
}
.block4 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 122px;
  height: 103px;
  position: absolute;
  left: 1117px;
  top: 368px;
}
.icon-variants4 {
  position: absolute;
  left: calc(50% - 48px);
  top: calc(50% - 47.5px);
  overflow: visible;
}
.block5 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 122px;
  height: 103px;
  position: absolute;
  left: 556px;
  top: 506px;
}
.icon-variants5 {
  position: absolute;
  left: calc(50% - 48px);
  top: calc(50% - 47.5px);
  overflow: visible;
}
.block6 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 122px;
  height: 103px;
  position: absolute;
  left: 1117px;
  top: 506px;
}
.icon-variants6 {
  position: absolute;
  left: calc(50% - 48px);
  top: calc(50% - 47.5px);
  overflow: visible;
}
.button-square-2-big-1-primary {
  width: 94px;
  height: 41px;
  position: absolute;
  left: 614px;
  top: 644px;
}
.group-12 {
  width: 94px;
  height: 41px;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: hidden;
}
.button {
  background: #3056d3;
  border-radius: 6px;
  width: 94px;
  height: 41px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.button-text {
  color: #ffffff;
  text-align: center;
  font: 600 16px/24px "Manrope", sans-serif;
  position: absolute;
  right: 48px;
  left: 46px;
  bottom: 2px;
  top: 15px;
}
.button-square-2-big-1-primary2 {
  width: 94px;
  height: 41px;
  position: absolute;
  left: 733px;
  top: 644px;
}
.button-text2 {
  color: #ffffff;
  text-align: center;
  font: 600 16px/24px "Manrope", sans-serif;
  position: absolute;
  right: 761px;
  left: 642px;
  bottom: 123px;
  top: 653px;
}
.button-text3 {
  color: #ffffff;
  text-align: center;
  font: 600 16px/24px "Manrope", sans-serif;
  position: absolute;
  right: 642px;
  left: 761px;
  bottom: 123px;
  top: 653px;
}
</style>
